<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>后台书籍管理</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0, user-scalable=no" />
    <title>Future book</title>
</head>
<!-- 作为公共部分分离 -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
<link rel="stylesheet" href="../../resources/css/header.css" th:href="@{/resources/css/header.css}">
<link rel="stylesheet" href="../../resources/css/cut.css" th:href="@{/resources/css/cut.css}">
<link rel="stylesheet" href="../../resources/font/iconfont.css" th:href="@{/resources/font/iconfont.css}">
<!-- 作为公共部分分离/ -->
<link rel="stylesheet" href="../../resources/css/backstage-book.css" th:href="@{/resources/css/backstage-book.css}">
<body>
<!-- 作为公共部分分离 -->
    <div class="shortcut">
        <div class="w">
            <!-- <ul class="fl"><a href="javascript:">future book</a></ul> -->
            <ul class="fl left" >
                <li class="fl" id="pngfix"><a href="javascript:"><i class="iconfont icon-cebianlanshousuo"></i></a></li>
                <li class="fl"><a href="FutureNovel.html" th:href="@{/index}"><i class="iconfont icon-earth"></i></a></li>
            </ul>
            <ul class="fr" th:each="user:${session.currentAccount}">
                <li class="message fl"><i class="iconfont icon-Message"></i></li>
                <li class="skin fl"><i class="iconfont icon-ColorLens"></i></li>
                <li class="s-name fl"></li>
                <li class="admin fl" id="admin"><span th:text="${user.userName}"></span><i class="iconfont icon-downarrow"></i>
                    <ul class="dropdown" id="dropdown" style="display: none;">
                        <li><a th:href="'/user/'+${session.currentAccount.uid.toString()}">个人信息</a></li>
                        <li><a href="login.html" th:href="@{/login}">切换账号</a></li>
                        <li onclick="yes_no('确认退出吗','logout_user')"><a href="javascript:" id="out" >退出</a></li>
                    </ul>
                </li>
                
            </ul>
        </div>
    </div>
    <div class="catalog" id="catalog">
    <div class="side fl">
        <div class="logo">
            <span>未来小说网</span>
        </div>
        <ul>
            <li class="active"><a href="backstage-book.html" th:href="@{/admin/books}">书籍管理</a></li>
            <li><a href="backstage-user.html" th:href="@{/admin/users}">用户管理</a></li>
            <li><a href="backstage-comment.html" th:href="@{/admin/comments}">评论管理</a></li>
            <li><a href="backstage-poster.html" th:href="@{/admin/posters}">海报管理</a></li>
        </ul>
    </div>
    </div>
    <div class="contant" id="contant">
        <div class="book">
            <div class="function">
                <span>小说名</span> <input type="text" class="seek" id="seek_novel"  placeholder="请输入">
                
                <button type="button" class="btn-seek" onclick="seek_book()"><i class="iconfont icon-iconseach"></i></button>
            </div>
            <div class="function">    
                
            </div>
            <table class="data_dispaly">
                <thead>
                    <tr>
                        <th style="width: 13%;">小说名</th>
                        <th style="width: 20%;">作者</th>
                        <th style="width: 4%;">热度</th>
                        <th style="width: 13%;">系列</th>
                        <th style="width: 15%;">发布时间</th>
                        <th style="width: 13%;">版权</th>
                        <th style="width: 24%;">操作</th>
                    </tr>
                </thead>
                <tbody class="tbody" id="a">
                    
                </tbody>
            </table>
            <span id="control_page">

            </span>
            <span id="control_onepage">
                <select name="status" class="item" id="change_item" οnchange="change_page_book()" >
                <option value="10" selected>10条/页</option>
                <option value="20" >20条/页</option>
                <option value="50" >50条/页</option>
                </select>
            </span>
            <div class="but">
                
                <button type="button" class="btn" id="gopre">上一页</button>
                <input type="text" class="go" id="go" style="border: 1px solid #BBBBBB; width: 25px; height: 27px; padding-left: 0;">
                <button type="button" class="btn" id="gogogo">go</button>
                <button type="button" class="btn" id="gonext">下一页</button>
            </div>
        </div>
    </div>
<!-- 作为公共部分分离/ -->
</body>

<script th:inline="javascript" async>
    const contextPath=/*[[${#request.getContextPath()}]]*/'http://localhost:8080/future-novel';
    var curPage=1,
        onepage=$('#change_item').find('option:selected').val();
        function copyright(copyright){
            if(copyright=='REPRINT'){
                return '转载'
            }else if(copyright=='ORIGINAL'){
                return '原创'
            }else if(copyright=='FAN_FICTION'){
                return '同人'
            }else{
                return '无版权'
            }
        }
    $(document).ready(function(){

        $.ajax({
                url:contextPath+"/api/admin/novel/all/pages" ,
                type:'GET',
                data:{
                    per_page: Number(onepage)
                },

                success: function(data){
                    let allPage=data.pages;
                    console.log(data)
                    $.ajax({
                        url:contextPath+"/api/admin/novel/all" ,
                        type:'GET',
                        data:{
                            per_page: Number(onepage),
                            page: Number(curPage)
                        },
                        success: function(data){
                            $('#a').empty();
                            $.each(data,function(i){
                                $('#a').append(`<tr>
                                        <th style="width: 13%;" class='novel_name'>${data[i].title}</th>
                                        <th style="width: 20%;">${data[i].authors}</th>
                                        <th style="width: 4%;">${data[i].hot}</th>
                                        <th style="width: 13%;">${data[i].series}</th>
                                        <th style="width: 15%;">${data[i].pubdate}</th>
                                        <th style="width: 13%;">${copyright(data[i].copyright)}</th>
                                        <th style="width: 24%;"><span class="modify-user" onclick="popup_book('${data[i].uniqueId}','${data[i].title}','${data[i].publisher}')"><i class="iconfont icon-xiugai"> 编辑</i></span> <span class="modify-user" style="background-color: #FF5722;" onclick="yes_no('确认删除吗？','book_del','${data[i].uniqueId}')"><i class="iconfont icon-shanchu"> 删除</i></span></th>
                                    </tr>`)
                                    })
                            $('#control_page').empty();      
                            $('#control_page').prepend('第'+curPage+'页/共'+allPage+'页');
                            console.log(data)
                        },
                        error: function(jqXHR) {
                            //const data = JSON.parse(jqXHR.responseText);
                            let mes = JSON.parse(jqXHR.responseText);
                            popup_over('icon-sad','#d81e06',mes.errorMessage);
                        }
                    })
                    $('#gonext').on('click',function(){
                        if(curPage>=1 && curPage<allPage){
                            curPage=Number(curPage)+1;
                        }
                        console.log(curPage)
                        $.ajax({
                        url:contextPath+"/api/admin/novel/all",
                        type:'GET',
                        data:{
                            per_page: Number(onepage),
                            page: Number(curPage)
                        },
                        success: function(data){
                            $('#a').empty();
                            $.each(data,function(i){
                                        $('#a').append(`<tr>
                                        <th style="width: 13%;" class='novel_name'>${data[i].title}</th>
                                        <th style="width: 20%;">${data[i].authors}</th>
                                        <th style="width: 4%;">${data[i].hot}</th>
                                        <th style="width: 13%;">${data[i].series}</th>
                                        <th style="width: 15%;">${data[i].pubdate}</th>
                                        <th style="width: 13%;">${data[i].copyright}</th>
                                        <th style="width: 24%;"><span class="modify-user" onclick="popup_book('${data[i].uniqueId}','${data[i].title}','${data[i].publisher}')"><i class="iconfont icon-xiugai"> 编辑</i></span> <span class="modify-user" style="background-color: #FF5722;" onclick="yes_no('确认删除吗？','book_del','${data[i].uniqueId}')"><i class="iconfont icon-shanchu"> 删除</i></span></th>
                                    </tr>`)
                                    })
                                    $('#control_page').empty()        
                            $('#control_page').prepend('第'+curPage+'页/共'+allPage+'页')
                            console.log(data)
                        },
                        error: function(jqXHR) {
                            //const data = JSON.parse(jqXHR.responseText);
                            let mes = JSON.parse(jqXHR.responseText);
                            popup_over('icon-sad','#d81e06',mes.errorMessage);
                        }
                    })
                    })
                    $('#gopre').on('click',function(){
                        if(curPage>1 && curPage<=allPage){
                            curPage=Number(curPage)-1;
                        }
                        console.log(curPage)
                        $.ajax({
                        url:contextPath+"/api/admin/novel/all",
                        type:'GET',
                        data:{
                            per_page: Number(onepage),
                            page: Number(curPage)
                        },
                        success: function(data){
                            $('#a').empty();
                            $.each(data,function(i){
                                        $('#a').append(`<tr>
                                        <th style="width: 13%;" class='novel_name'>${data[i].title}</th>
                                        <th style="width: 20%;">${data[i].authors}</th>
                                        <th style="width: 4%;">${data[i].hot}</th>
                                        <th style="width: 13%;">${data[i].series}</th>
                                        <th style="width: 15%;">${data[i].pubdate}</th>
                                        <th style="width: 13%;">${data[i].copyright}</th>
                                        <th style="width: 24%;"><span class="modify-user" onclick="popup_book('${data[i].uniqueId}','${data[i].title}','${data[i].publisher}')"><i class="iconfont icon-xiugai"> 编辑</i></span> <span class="modify-user" style="background-color: #FF5722;" onclick="yes_no('确认删除吗？','book_del','${data[i].uniqueId}')"><i class="iconfont icon-shanchu"> 删除</i></span></th>
                                    </tr>`)
                                    })
                            $('#control_page').empty();    
                            $('#control_page').prepend('第'+curPage+'页/共'+allPage+'页')
                            console.log(data)
                        },
                        error: function(jqXHR) {
                            //const data = JSON.parse(jqXHR.responseText);
                            let mes = JSON.parse(jqXHR.responseText);
                            popup_over('icon-sad','#d81e06',mes.errorMessage);
                        }
                    })
                    })
                    $('#gogogo').on('click',function(){
                    if($('#go').val()>=1 && $('#go').val()<=allPage){
                    curPage=$('#go').val();
                    $.ajax({
                        url:contextPath+"/api/admin/novel/all",
                        type:'GET',
                        data:{
                            per_page: Number(onepage),
                            page: Number(curPage)
                        },
                        success: function(data){
                            $('#a').empty();
                            $.each(data,function(i){
                                $('#a').append(`<tr>
                                        <th style="width: 13%;" class='novel_name'>${data[i].title}</th>
                                        <th style="width: 20%;">${data[i].authors}</th>
                                        <th style="width: 4%;">${data[i].hot}</th>
                                        <th style="width: 13%;">${data[i].series}</th>
                                        <th style="width: 15%;">${data[i].pubdate}</th>
                                        <th style="width: 13%;">${data[i].copyright}</th>
                                        <th style="width: 24%;"><span class="modify-user" onclick="popup_book('${data[i].uniqueId}','${data[i].title}','${data[i].publisher}')"><i class="iconfont icon-xiugai"> 编辑</i></span> <span class="modify-user" style="background-color: #FF5722;" onclick="yes_no('确认删除吗？','book_del','${data[i].uniqueId}')"><i class="iconfont icon-shanchu"> 删除</i></span></th>
                                    </tr>`)
                                    })
                            $('#control_page').empty()        
                            $('#control_page').prepend('第'+curPage+'页/共'+allPage+'页')
                            console.log(data)
                        },
                        error: function(jqXHR) {
                            //const data = JSON.parse(jqXHR.responseText);
                            let mes = JSON.parse(jqXHR.responseText);
                            popup_over('icon-sad','#d81e06',mes.errorMessage);
                        }
                    })
                    }else{
                        popup_over('icon-sad','#d81e06',"不存在");
                    }
                    
                })
                },
                error: function(jqXHR) {
                    let data = JSON.parse(jqXHR.responseText);
                    popup_over('icon-sad','#d81e06',data.errorMessage);
                }
            })

    })        
</script>
<!-- 作为公共部分分离 -->
<script src="../../resources/js/index.js" th:src="@{/resources/js/index.js}">
</script>
<script src="../../resources/js/index2.js" th:src="@{/resources/js/index2.js}"></script>
<!-- 作为公共部分分离/ -->
</html>